<template>
    <div>
        <el-select v-model="grouping" filterable clearable size="small" @change="fetchList">
            <el-option
                    v-for="item in options"
                    :key="item.dictName"
                    :label="item.dictName"
                    :value="item.dictNo">
            </el-option>
        </el-select>
    </div>
</template>

<script>
    import {mapActions, mapState} from 'vuex'

    export default {
        name: "grouping",
        data() {
            return {
                options: [],
                grouping: '',
                data2: {
                    dictName: "全部",
                    dictNo: '',
                    dictType: "FZ",
                }
            }
        },
        methods: {
            ...mapActions('coachTraining', [
                'fetchPlayerList',
                'deletePlayer',
                'fetchSelectList'
            ]),
            getSelect() {
                this.fetchSelectList({type: 'FZ'}).then(res => {
                    const {code, data: {list}} = res
                    console.log(list);
                    if (code === 200) {
                        this.options = list || []
                        this.options.unshift(this.data2)
                    }
                })
            },
            fetchList() {
                this.$emit('change', this.grouping);
            }
        },
        created() {
            this.getSelect()
        },
    }
</script>

<style scoped>

</style>
